<layout name="layout" />
<div class="main-div">
    <form name="main_form" method="POST" action="__SELF__" enctype="multipart/form-data">
        <table cellspacing="1" cellpadding="3" width="100%">
            <tr>
                <td class="label">角色名称：</td>
                <td>
                    <input  type="text" name="role_name" value="" />
                </td>
            </tr>
               <tr>
                <td class="label">权限列表：</td>
                <td>
                   <?php foreach($parentData as $k =>$v):?>
                   <?php echo str_repeat('-', 8*$v['level']); ?> 
                   <input level_id="<?php echo $v['level'];?>" type="checkbox" name="priids[]" value="<?php echo $v['id']?>"/> 
                   <?php echo $v['pri_name']?>
                   <br />
                   <?php endforeach;?>
                </td>
            </tr>
           
            <tr>
                <td colspan="99" align="center">
                    <input type="submit" class="button" value=" 确定 " />
                    <input type="reset" class="button" value=" 重置 " />
                </td>
            </tr>
        </table>
    </form>
</div>


<script>
    $(function(){
      // 为所有的复选框绑定一个点击事件
$(":checkbox").click(function(){
	// 先获取点击的这个level_id
	var tmp_level_id = level_id = $(this).attr("level_id");
	// 判断是选中还是取消
	if($(this).prop("checked"))
	{
		// 所有的子权限也选中
		$(this).nextAll(":checkbox").each(function(k,v){
			if($(v).attr("level_id") > level_id){
                            $(v).prop("checked", "checked");
                        }
			else{
                            // 这个里面是关键，遇到比他小的，那基本上是到了下一个，这个时候就退出这个循环
                            return false;
                        }	
			
		});
		// 所有的上级权限也选中
		$(this).prevAll(":checkbox").each(function(k,v){
			if($(v).attr("level_id") < tmp_level_id)
			{
				$(v).prop("checked", "checked");
				tmp_level_id--; // 再找更上一级的 ，这个必须要，要不然的 上一级的也会去选择
			}
		});
	}
	else
	{
		// 所有的子权限也取消
		$(this).nextAll(":checkbox").each(function(k,v){
			if($(v).attr("level_id") > level_id)
				$(v).removeAttr("checked");
			else
				return false;
		});
	}
});
    });
</script>